import React from 'react';
import renderer from 'react-test-renderer';
import ModalTestScreen from '../src/screens/stacks/feedback/ModalTestScreen';

describe('反馈 Modal 功能测试', () => {
  test('中心弹窗打开与关闭', () => {
    const tree = renderer.create(<ModalTestScreen />);

    // 打开中心弹窗
    tree.root.findByProps({ testID: 'btn-open-center' }).props.onPress();
    const centerModal = tree.root.findByProps({ testID: 'modal-center' });
    expect(centerModal.props.visible).toBe(true);

    // 关闭中心弹窗
    tree.root.findByProps({ testID: 'btn-close-center' }).props.onPress();
    const centerModalAfter = tree.root.findByProps({ testID: 'modal-center' });
    expect(centerModalAfter.props.visible).toBe(false);
  });

  test('底部弹窗打开与关闭', () => {
    const tree = renderer.create(<ModalTestScreen />);

    // 打开底部弹窗
    tree.root.findByProps({ testID: 'btn-open-bottom' }).props.onPress();
    const bottomModal = tree.root.findByProps({ testID: 'modal-bottom' });
    expect(bottomModal.props.visible).toBe(true);

    // 关闭底部弹窗
    tree.root.findByProps({ testID: 'btn-close-bottom' }).props.onPress();
    const bottomModalAfter = tree.root.findByProps({ testID: 'modal-bottom' });
    expect(bottomModalAfter.props.visible).toBe(false);
  });

  test('切换 closable 与 maskClosable 后仍可控制显示隐藏', () => {
    const tree = renderer.create(<ModalTestScreen />);

    // 切换开关
    tree.root.findByProps({ testID: 'switch-closable' }).props.onValueChange(false);
    tree.root.findByProps({ testID: 'switch-mask-closable' }).props.onValueChange(false);

    // 打开中心弹窗并关闭
    tree.root.findByProps({ testID: 'btn-open-center' }).props.onPress();
    expect(tree.root.findByProps({ testID: 'modal-center' }).props.visible).toBe(true);
    tree.root.findByProps({ testID: 'btn-close-center' }).props.onPress();
    expect(tree.root.findByProps({ testID: 'modal-center' }).props.visible).toBe(false);
  });
});